<template>
    <div class="main">
        <div class="wrap">
            <div class="loginLogo">
                <div class="logoIcon"><img src="../../images/ksbao/yinglogo.png" alt="英腾教育" /></div>
            </div>
            <ul class='loginTab'>
                <li v-for="(item, index) in ['登录', '注册d']" :class="{'curentTab': index == showSubMenu ? 0 : 1}" @click="changeShowSubMenu(index)">
                    <span>{{ item }}</span>
                </li>
            </ul>
            <!-- 登录 -->
            <loginMenu v-show="showSubMenu"></loginMenu>
            <!-- 注册/重置密码 -->
            <registMenu v-show="!showSubMenu" :isRegShow="isRegShow" :reType="registerType" ref="regChild" v-on:changeHidden="customHidden($event)" v-on:changeReg="changeShowSubMenu(0)"></registMenu>
            <!-- 注册/重置密码 -->
        </div>
        <!-- 协议组件 -->
        <agreenment :isShowGreen="isShowAgreen" v-on:changeHidden="customHidden($event)"></agreenment>
        <!-- 远程引入组件 -->
        <remoteJS src="//cstaticdun.126.net/load.min.js">
        </remoteJS>
    </div>
</template>
<script>
import agreenment from "./children/agreenment.vue";
import loginMenu from "./children/loginMenu.vue";
import registMenu from "./children/registMenu.vue";
export default {
    components: {
        loginMenu,  // 登录
        registMenu, // 注册
        agreenment, // 协议
        remoteJS: {  // 验证码js
            render(createElement) {
                return createElement('script', { attrs: { type: 'text/javascript', src: this.src } });
            },
            props: {
                src: { type: String, required: true },
            },
        }
    },
    data: function() {
        return {
            isRegShow: true,
            registerType: 'regist',   // regist or restorePassword
            showSubMenu: true,     // 显示登录true or 显示注册 false
            isShowAgreen: false, // 是否显示协议
        }
    },
    methods: {
        customHidden(msg) {
            // 改变协议隐藏变量值
            this.isShowAgreen = msg;
        },
        changeShowSubMenu(index) {
            // 显示隐藏登录 or 注册
            var _that = this;
            if ((_that.showSubMenu && index === 0) || (!_that.showSubMenu && index === 1)) {
                return;
            }
            _that.showSubMenu = index === 1 ? false : true;
            if (!_that.showSubMenu) {
                _that.$refs.regChild.parengtChange(_that.showSubMenu);
            }
        }
    }
}

</script>
<style lang="less">
@import "./login.less";
.yidun_intellisense--light .yidun_intelli-control {
    border-color: #ff9945!important;
    background: #fff!important;
    font-size: 16px!important;
    border-radius: 4px!important;
}

.yidun_intellisense--light .yidun_intelli-icon {
    display: none!important;
}

.yidun_intellisense--light .yidun_intelli-tips {
    color: #ff9945!important;
}
.weui-toast__content {
    color: #fff;
}

</style>
